<template>
    <div class='main'>
        <div class='head-menu'>
            
        </div>

        <div class='left-menu'>

            <Col span="8">
                <Menu :theme="theme2"  accordion >
                    <Submenu  v-for="item in menu" :name="item.id" :key="item.id">
                        <template slot="title">
                            <Icon :type="item.icon" />
                            {{item.name}}
                        </template>
                        <MenuItem v-for="row of item.children" :key="row.id" :name="row.id" :to="row.routeName">{{row.name}}</MenuItem>
                      
                    </Submenu>

                </Menu>
            </Col>
        </div>

        <div class="box" > 
            <router-view></router-view>
        </div>

    </div>
</template>

<script>

import menu from '../lib/menu.js';

export default {
   
    data(){
        return {
            menu:menu.leftMenu,
            theme2: 'dark'
        }
    },
    methods:{
        selectMenu(name){
            if(name%2==0){
                this.$router.push({name:'home',params:{tab:name}});
            }else{
                this.$router.push({name:'admin',params:{tab:name}});
            }
            
        },
        getData(){
        this.ajax.getHomePage({
           data:{id:1},
           success:(res)=>{
               console.log(res);
           },
           error:(res)=>{
               console.log('error',res);
           }
       })
        }
    },
    created(){
      this.getData();

    }
}
</script>

<style>
    @import "../less/index.less";
</style>

